var app = new Vue({
    el: '#app',
    data: {
        list: [
            {
                name:'电子产品',
                productList:[{

                    id: 1,
                    name: 'iphone 7',
                    price: 6188,
                    count: 1,
                    status: 1//单选框选中
                },
                {
                    id: 2,
                    name: 'ipad Pro',
                    price: 5188,
                    count: 1,
                    status: 1
                },
                {
                    id: 3,
                    name: 'MacBook Pro',
                    price: 21888,
                    count: 1,
                    status: 1
                }]
            },
            {
                name:'生活用品',
                productList:[{

                    id: 1,
                    name: '毛巾',
                    price: 12,
                    count: 1,
                    status: 1,
                    // isCheck: true//单选框选中
                },
                {
                    id: 2,
                    name: '牙刷',
                    price: 8,
                    count: 1,
                    status: 1
                },
                {
                    id: 3,
                    name: '工具箱',
                    price: 55,
                    count: 1,
                    status: 1
                }]
            },
            {
                name:'果蔬',
                productList:[{

                    id: 1,
                    name: '苹果',
                    price: 6,
                    count: 1,
                    status: 1//单选框选中
                },
                {
                    id: 2,
                    name: '大白菜',
                    price: 2,
                    count: 1,
                    status: 1
                },
                {
                    id: 3,
                    name: '香蕉',
                    price: 3,
                    count: 1,
                    status: 1
                }]
            }
            
        ],
        //isAllChecked:true//全选框选中
    },
    computed: {        
                totalPrice: function () {
                    var total = 0;
                    for (var i = 0; i < this.list.length; i++) {
                        for(var j = 0;j<this.list[i].productList.length;j++){

                            var item = this.list[i].productList[j];
                            
                            if(item.status){
                                total += item.price * item.count;
                            }
                        }
                    }
                    
                    return total != 0 ? total.toString().replace(/\B(?=(\d{3})+$)/g,','):0;//（\B匹配非单词边界，\b匹配单词边界）
                }
    },
    methods: {

        handleTableItem:function(tableItem){
            var status = this.isCheckedTableItem(tableItem);
            status = status ? 0 : 1;
            for(var i= 0;i<tableItem.productList.length;i++){
                tableItem.productList.status = status;
            }
        },
        isCheckedTableItem:function(tableItem){
            //console.log("tableItem:"+tableItem)

            var status = true;
            for(var i = 0;i<tableItem.productList.length;i++){
                if(!tableItem.productList[i].status){
                    status = false;
                    return status;
                }                
            }
            return status;
        },

        //改变某条记录选中状态
        handleChecked:function(item){
            item.status = !item.status;
        },
        //商品数量减1
        handleReduce: function (item) {
            if (item === 1) return;
            item.count--;
        },
        //商品数量加1
        handleAdd: function (item) {
            item.count++;
        },
        //移除商品
        handleRemove: function (index,tableIndex) {
            this.list[tableIndex].productList.splice(index, 1);
        },
      
        isChecked:function(item){
            return item.status;
        },
        isCheckedAll:function(){
            //列表全为true该status才为true，否则为false
            var status = true;
            for(var i = 0;i<this.list.length;i++){
                //一旦列表的status有一个为false则status就为false
                for(var j = 0;j<this.list[i].productList.length;j++){
                    if(!this.list[i].productList[j].status){
                        status = false;
                        return status;
                    }
                }
            }
            return status;
        },
        checkAll:function(){
            //拿到是否时全选
            var status = this.isCheckedAll();
            status = status ? 0 : 1;
            for(var i = 0 ;i<this.list.length;i++){
                for(var j = 0 ;j<this.list[i].productList.length;j++){
                    this.list[i].productList[j].status = status;
                }
            }
        }
    }

});